<template>
  <el-dialog width="80%" :title="titleMap[status]" :visible.sync="visible" :close-on-click-modal="false" @open="open" @close="$emit('update:show', false)">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="线路" prop="line">
        <el-radio-group v-model="form.line">
          <el-radio v-for="item in lineList" :key="item.value" :label="item.value">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="功能" prop="line">
        <el-radio-group v-model="form.script_id">
          <el-radio v-for="item in scriptList" :key="item.id" :label="item.id">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="配置" prop="json_path">
        <el-radio-group v-model="form.json_id">
          <el-radio v-for="item in jsonList" :key="item.id" :label="item.id">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="主机" prop="host">
        <el-radio-group v-model="form.host_ip">
          <el-radio v-for="item in hostList" :key="item.ip" :label="item.ip">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="设置">
        <el-checkbox v-model="form.auto_restart" style="margin-left: 20px">自动重启</el-checkbox>
        <el-checkbox v-model="form.injure_stop">受伤停止</el-checkbox>
        <el-checkbox v-model="form.soul_stop">丢魂停止</el-checkbox>
        <el-checkbox v-model="form.auto_login" style="margin-left: 20px">自动登录</el-checkbox>
        <el-checkbox v-model="form.auto_change_line" style="margin-left: 20px">自动换线</el-checkbox>
        <el-checkbox v-model="form.skip_update" style="margin-left: 20px">禁用登录器更新</el-checkbox>
      </el-form-item>
      <el-form-item label="创建角色">
        <el-checkbox v-model="form.auto_create" style="margin-left: 20px">自动创建角色</el-checkbox>
      </el-form-item>
      <el-form-item label="名字前缀">
        <el-input v-model="form.create_name" :disabled="!form.auto_create" style="width: 50%" />
      </el-form-item>
      <el-form-item label="角色">
        <el-radio-group v-model="form.create_role" :disabled="!form.auto_create" style="width: 100%">
          <el-radio v-for="item in roleList" :key="item.value" :label="item.value">
            <span class="demonstration">{{ item.name }}</span>
            <el-image
              style="width: 50px; height: 80px"
              :src="item.img"
              :alt="item.name"
            />
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="颜色">
        <el-radio-group v-model="form.create_color" :disabled="!form.auto_create">
          <el-radio v-for="item in colorList" :key="item" :label="item">{{ item }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="加点">
        <el-radio-group v-model="form.create_points" :disabled="!form.auto_create">
          <el-radio v-for="item in pointList" :key="item.value" :label="item.value">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="水晶">
        <el-radio-group v-model="form.create_element" :disabled="!form.auto_create">
          <el-radio v-for="item in elementList" :key="item.value" :label="item.value">{{ item.name }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <!--
      <el-table
        :data="users"
      >
        <el-table-column
          prop="master_id"
          label="主账号"
        />
        <el-table-column
          prop="slave_id"
          label="子账号"
        />
        <el-table-column
          prop="name"
          label="名称"
        />
        <el-table-column
          prop="job"
          label="职业"
        />
      </el-table>
      -->
      <el-form-item>
        <el-button type="primary" @click="opObj">确定</el-button>
        <el-button @click="cancelDialog">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script>
import {
  runUserListApi
} from '@/api/user'
import {
  getScriptListApi
} from '@/api/script'
import {
  getHostListApi
} from '@/api/host'
import {
  getSettingListApi
} from '@/api/setting'
import 巴乌 from '@/assets/user_head_images/巴乌.png'
import 卡兹 from '@/assets/user_head_images/卡兹.png'
import 辛 from '@/assets/user_head_images/辛.png'
import 托布 from '@/assets/user_head_images/托布.png'
import 凯 from '@/assets/user_head_images/凯.png'
import 菲特 from '@/assets/user_head_images/菲特.png'
import 伯克 from '@/assets/user_head_images/伯克.png'
import 乌噜 from '@/assets/user_head_images/乌噜.png'
import 萌子 from '@/assets/user_head_images/萌子.png'
import 阿咪 from '@/assets/user_head_images/阿咪.png'
import 梅古 from '@/assets/user_head_images/梅古.png'
import 丽 from '@/assets/user_head_images/丽.png'
import 卡伊 from '@/assets/user_head_images/卡伊.png'
import 艾露 from '@/assets/user_head_images/艾露.png'
import 谢堤 from '@/assets/user_head_images/谢堤.png'
import 彼特 from '@/assets/user_head_images/彼特.png'
import 左藏 from '@/assets/user_head_images/左藏.png'
import 尼尔森 from '@/assets/user_head_images/尼尔森.png'
import 贝堤特 from '@/assets/user_head_images/贝堤特.png'
import 兰斯洛特 from '@/assets/user_head_images/兰斯洛特.png'
import 威斯凯尔 from '@/assets/user_head_images/威斯凯尔.png'
import 莎拉 from '@/assets/user_head_images/莎拉.png'
import 绫女 from '@/assets/user_head_images/绫女.png'
import 福尔蒂雅 from '@/assets/user_head_images/福尔蒂雅.png'
import 夏菈 from '@/assets/user_head_images/夏菈.png'
import 萍萍 from '@/assets/user_head_images/萍萍.png'
import 葛蕾丝 from '@/assets/user_head_images/葛蕾丝.png'
import 荷蜜 from '@/assets/user_head_images/荷蜜.png'

export default {
  name: 'FormDialog',
  props: {
    objId: {
      type: String,
      default: null
    },
    status: {
      required: true,
      type: String
    },
    show: {
      type: Boolean,
      default: false
    },
    users: {
      type: Array,
      default: () => { [] }
    }
  },
  data() {
    return {
      loading: false,
      visible: this.show,
      titleMap: {
        create: '创建',
        update: '编辑'
      },
      colorList: ['1', '2', '3', '4'],
      pointList: [
        { name: '纯攻敏', value: '0,15,0,15,0' },
        { name: '纯血魔', value: '15,0,0,0,15' },
        { name: '纯血敏', value: '15,0,0,15,0' },
        { name: '纯防魔', value: '0,0,15,0,15' },
        { name: '满魔大血小防', value: '10,0,5,0,15' },
        { name: '满攻大血小敏', value: '10,15,0,5,0' },
        { name: '满攻大敏小血', value: '5,15,0,10,0' }
      ],
      elementList: [
        { name: '纯地', value: '10,0,0,0' },
        { name: '纯水', value: '0,10,0,0' },
        { name: '纯火', value: '0,0,10,0' },
        { name: '纯风', value: '0,0,0,10' },
        { name: '地水', value: '5,5,0,0' },
        { name: '风地', value: '5,0,0,5' },
        { name: '火风', value: '0,0,5,5' },
        { name: '水火', value: '0,5,5,0' }
      ],
      roleList: [
        { name: '巴乌', value: '1', img: 巴乌 },
        { name: '卡兹', value: '2', img: 卡兹 },
        { name: '辛', value: '3', img: 辛 },
        { name: '托布', value: '4', img: 托布 },
        { name: '凯', value: '5', img: 凯 },
        { name: '菲特', value: '6', img: 菲特 },
        { name: '伯克', value: '7', img: 伯克 },
        { name: '乌噜', value: '8', img: 乌噜 },
        { name: '萌子', value: '9', img: 萌子 },
        { name: '阿咪', value: '10', img: 阿咪 },
        { name: '梅古', value: '11', img: 梅古 },
        { name: '丽', value: '12', img: 丽 },
        { name: '卡伊', value: '13', img: 卡伊 },
        { name: '艾露', value: '14', img: 艾露 },
        { name: '谢堤', value: '15', img: 谢堤 },
        { name: '彼特', value: '16', img: 彼特 },
        { name: '左藏', value: '17', img: 左藏 },
        { name: '尼尔森', value: '18', img: 尼尔森 },
        { name: '贝堤特', value: '19', img: 贝堤特 },
        { name: '兰斯洛特', value: '20', img: 兰斯洛特 },
        { name: '威斯凯尔', value: '21', img: 威斯凯尔 },
        { name: '莎拉', value: '22', img: 莎拉 },
        { name: '绫女', value: '23', img: 绫女 },
        { name: '福尔蒂雅', value: '24', img: 福尔蒂雅 },
        { name: '夏菈', value: '25', img: 夏菈 },
        { name: '萍萍', value: '26', img: 萍萍 },
        { name: '葛蕾丝', value: '27', img: 葛蕾丝 },
        { name: '荷蜜', value: '28', img: 荷蜜 }
      ],
      lineList: [
        { name: '随机', value: 0 },
        { name: '1线', value: 1 },
        { name: '2线', value: 2 },
        { name: '3线', value: 3 },
        { name: '4线', value: 4 },
        { name: '5线', value: 5 },
        { name: '6线', value: 6 },
        { name: '7线', value: 7 },
        { name: '8线', value: 8 },
        { name: '9线', value: 9 },
        { name: '10线', value: 10 }
      ],
      scriptList: [],
      jsonList: [],
      hostList: [],
      form: {
        line: 1,
        host_id: null,
        host_ip: null,
        json_id: null,
        json_path: '',
        script_path: '',
        script_id: null,
        users: this.users,
        injure_stop: false,
        soul_stop: false,
        auto_restart: true,
        auto_login: true,
        auto_change_line: false,
        skip_update: true,
        auto_create: false,
        create_name: '',
        create_role: '8',
        create_color: '3',
        create_points: '10,15,0,5,0',
        create_element: '10,0,0,0'
      }
    }
  },
  watch: {
    show: function() {
      this.visible = this.show
    },
    users: function() {
      this.form.users = this.users
    }
  },
  methods: {
    open() {
      this.getJsonList()
      this.getHostList()
      this.getScriptList()
      this.$nextTick(() => {
        this.$refs['form'].clearValidate()
      })
      this.resetForm()
    },
    getHostList() {
      const data = {}
      getHostListApi(data).then(resp => {
        if (resp.code === 0) {
          this.hostList = resp.data.data_list
          if (this.hostList.length > 0) {
            this.form.host_ip = this.hostList[0].ip
          }
        }
      })
    },
    getJsonList() {
      const data = {}
      getSettingListApi(data).then(resp => {
        if (resp.code === 0) {
          this.jsonList = resp.data.data_list
        }
      })
    },
    getScriptList() {
      const data = {}
      getScriptListApi(data).then(resp => {
        if (resp.code === 0) {
          this.scriptList = resp.data.data_list
        }
      })
    },
    resetForm() {
      this.form.line = 1
      this.form.script_id = null
      this.form.script_path = ''
      this.form.host_id = null
      this.form.host_ip = null
      this.form.json_id = null
      this.form.json_path = ''
      this.form.injure_stop = false
      this.form.soul_stop = false
      this.form.auto_restart = true
      this.form.auto_login = true
      this.form.auto_change_line = false
      this.form.skip_update = true
      this.form.auto_create = false
      this.form.create_name = ''
      this.form.create_role = '8'
      this.form.create_color = '3'
      this.form.create_points = '10,15,0,5,0'
      this.form.create_element = '10,0,0,0'
    },
    cancelDialog() {
      this.$emit('update:show', false)
    },
    opObj() {
      if (this.status === 'create') {
        this.createObj()
      }
    },
    createObj() {
      console.log(this.form)
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true
          const data = this.form
          runUserListApi(this.form.host_ip, data).then(resp => {
            if (resp.code === 0) {
              this.$emit('update:show', false)
              this.$notify({
                message: '操作成功',
                type: 'success',
                duration: 2000
              })
              this.$emit('success')
            }
            this.loading = false
          })
        }
      })
    }
  }
}
</script>
